<template>
  <el-table
    :data="tableData"
    border
    style="width: 100%">
    <el-table-column
      prop="id"
      label="ID">
    </el-table-column>
    <el-table-column
      prop="fileName"
      label="昵称">
    </el-table-column>
    <el-table-column
      fixed="right"
      label="操作"
      width="100">
      <template slot-scope="scope">
        <a :href="downloadFile(scope.row)">
          <el-button type="primary" icon="el-icon-download" circle size="mini"></el-button>
        </a>
        <el-button type="danger" icon="el-icon-delete" circle size="mini" @click="deleteExcel(scope.row,scope.$index, tableData)"></el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
  import axios from 'axios'

  export default {
    created() {
      axios.get("filenames").then(resp => {
        if (resp.data.result) {
          this.tableData = resp.data.msg
        }
      })
    },
    data() {
      return {
        tableData: [],
      }
    },
    methods: {
      downloadFile(row) {
        return axios.defaults.baseURL + "download?fileName=" + row.fileName;
      },
      deleteExcel(row,index,rows) {
       axios.get("deleteexcel",{
         params:{
           fileName:row.fileName
         }
       }).then(resp => {
         if(resp.data.result){
           rows.splice(index, 1)
           alert(resp.data.msg)
         }else {
           alert(resp.data.error)
         }
       })
      }
    },
  }
</script>

<style scoped>

</style>
